var divFrage;
var ausgewahlteAntwort;
var divAntwort = new Array();
var antwortName = new Array();
var progressBar;
var id;
/******************************************************************************
 * die Funktion fordert von Server die Frage
 ******************************************************************************/
function frageAnfordern(){
	if(flag == true){
		var senden = "2";
		socket.send(senden);
	}else{
		alert("Fehler beim Senden");
	}
}
/**
 * empfängt die Daten von Server und und ruft entsprechende Funktion
 * @param message
 */
function empfangeDaten(message){
	var data = message.data;
	console.log("Daten: " + data);
	var dataJson = eval("("+data+")");
	switch (dataJson.typ) {
	case '1' :
		if(flag == true){
			var senden = "2";
			socket.send(senden);
		}else{
			alert("Fehler beim Senden");
		}
		break;
	case '3' :
		frageDarstellen(dataJson);
		break;
	case '5' :
		console.log(dataJson.korrekt);
		frageRichtigOderFalsch(dataJson.korrekt);
		break;
	case '6' :
		spielEnde();
		id = dataJson.id;
		punkten = dataJson.punkten;
		break;
	case '7' :
		rang(dataJson);
		console.log("Rang typ 7 " + dataJson.rang);
		break;
	case '9' :
		katalog_markieren(dataJson.cat);
		break;
	case '0' :
		if(dataJson.fatal == 1){
			spielAbbrechen(dataJson.fehlerNachricht);
		}else{
			alert(dataJson.fehlerNachricht);
		}
		break;
	}
}
/**
 * Stellt die Frage mit Listener und Fortschritsbalke dar 
 * @param text
 */
function frageDarstellen(text){
	ausgewahlteAntwort = null;
	var hauptansicht = document.getElementById("hauptansicht");
	console.log("Hauptansicht" + hauptansicht);
	if(divAntwort[0] != null || divAntwort[1] != null || divAntwort[2] != null ||
			divAntwort[3] != null){
		for(var n = 0; n < 4; n++){
			hauptansicht.removeChild(divAntwort[n]);
		}
		hauptansicht.removeChild(divFrage);
	}
	
	var spielStart = document.getElementsByClassName("Button")[0];
	if(spielStart != null){
		hauptansicht.removeChild(spielStart);
	}
	progressBar = document.createElement("div");
	divFrage = document.createElement("div");
	divFrage.setAttribute("id", "frage");
	var frageText = document.createTextNode(text.frage);
	divFrage.appendChild(frageText);
	hauptansicht.appendChild(divFrage);
	for(var i = 0; i < 4; i++){
		divAntwort[i] = document.createElement("div");
		divAntwort[i].setAttribute("id", "antwort");
	}
	for(var k = 0; k < 4; k++){
		antwortName[k] = document.createTextNode(text.antwort[k]);
	}
	for(var l = 0; l < 4; l++){
		divAntwort[l].appendChild(antwortName[l]);
	}
	for(var m = 0; m < 4; m++){
		hauptansicht.appendChild(divAntwort[m]);
	}
	divAntwort[0].addEventListener("click", ergebnis1, true);
	divAntwort[1].addEventListener("click", ergebnis2, true);
	divAntwort[2].addEventListener("click", ergebnis3, true);
	divAntwort[3].addEventListener("click", ergebnis4, true);
	
	divAntwort[0].addEventListener("mouseover", mouseover1, true);
	divAntwort[1].addEventListener("mouseover", mouseover2, true);
	divAntwort[2].addEventListener("mouseover", mouseover3, true);
	divAntwort[3].addEventListener("mouseover", mouseover4, true);
	
	divAntwort[0].onmouseout = mouseout;
	divAntwort[1].onmouseout = mouseout;
	divAntwort[2].onmouseout = mouseout;
	divAntwort[3].onmouseout = mouseout;
	
	progressBar.setAttribute("id", "progressbar");
	hauptansicht.appendChild(progressBar);
	var time = text.timeout / 10;
	console.log("Time: " + time);
	$("#progressbar").show('slow');
	$(function() {
		var progressbar = $( "#progressbar" );
		progressbar.progressbar({
			value: false,
		});
	 
		function progress() {
			var val = progressbar.progressbar( "value" ) || 0;

			progressbar.progressbar( "value", val + 10 );
	 
			if ( val < 99 ) {
				setTimeout( progress, time);
			}
		}
		progress();
	});
}
/**
 * versteckt die Fortschritsbalke
 */
function countdown_clear() {
	 $("#progressbar").hide('slow');
}
/**
 * Listener Behandlung bei der Aswahl erster Antwort
 */
function ergebnis1(){
	countdown_clear();
	if(flag == true){
		var senden = "40";
		socket.send(senden);
	}else{
		alert("Fehler");
	}
	ausgewahlteAntwort = 0;
}
/**
 * Listener Behandlung bei der Aswahl zweiter Antwort
 */
function ergebnis2(){
	countdown_clear();
	if(flag == true){
		var senden = "41";
		socket.send(senden);
	}else{
		alert("Fehler");
	}
	ausgewahlteAntwort = 1;

}
/**
 * Listener Behandlung bei der Aswahl dritter Antwort
 */
function ergebnis3(){
	countdown_clear();
	if(flag == true){
		var senden = "42";
		socket.send(senden);
	}else{
		alert("Fehler");
	}
	ausgewahlteAntwort = 2;
}
/**
 * Listener Behandlung bei der Aswahl vierter Antwort
 */
function ergebnis4(){
	countdown_clear();
	if(flag == true){
		var senden = "43";
		socket.send(senden);
	}else{
		alert("Fehler");
	}
	
	ausgewahlteAntwort = 3;
}
/**
 * Listener Behandlung bei der Mousover über der Antwort 1, 2, 3, 4
 */
function mouseover1(){
	for(var i = 0; i < 4; i++){
		divAntwort[i].setAttribute("id", "antwort");
	}
	divAntwort[0].setAttribute("id", "antwort_mouseover");
}

function mouseover2(){
	for(var i = 0; i < 4; i++){
		divAntwort[i].setAttribute("id", "antwort");
	}
	divAntwort[1].setAttribute("id", "antwort_mouseover");
}

function mouseover3(){
	for(var i = 0; i < 4; i++){
		divAntwort[i].setAttribute("id", "antwort");
	}
	divAntwort[2].setAttribute("id", "antwort_mouseover");
}

function mouseover4(){
	for(var i = 0; i < 4; i++){
		divAntwort[i].setAttribute("id", "antwort");
	}
	divAntwort[3].setAttribute("id", "antwort_mouseover");
}

function mouseout(){
	for(var i = 0; i < 4; i++){
		divAntwort[i].setAttribute("id", "antwort");
	}
}
/**
 * 
 * @param korrekteAntwort
 * Funktion bekommt richtige Antwort von Server und 
 * wertet sie mit der Auswahl von Benutzer aus
 */
function frageRichtigOderFalsch(korrekteAntwort){
	for(var i = 0; i < 4; i++){
		if(korrekteAntwort == i){
			if(korrekteAntwort == i && ausgewahlteAntwort == i){
				divAntwort[0].removeEventListener("mouseover", mouseover1, true);
				divAntwort[1].removeEventListener("mouseover", mouseover2, true);
				divAntwort[2].removeEventListener("mouseover", mouseover3, true);
				divAntwort[3].removeEventListener("mouseover", mouseover4, true);
				divAntwort[0].onmouseout = null;
				divAntwort[1].onmouseout = null;
				divAntwort[2].onmouseout = null;
				divAntwort[3].onmouseout = null;
				divAntwort[i].setAttribute("id", "antwort_richtig");
				$("#progressbar").hide('slow');
				setTimeout('frageAnfordern()', 2000);
			}else{
				divAntwort[0].removeEventListener("mouseover", mouseover1, true);
				divAntwort[1].removeEventListener("mouseover", mouseover2, true);
				divAntwort[2].removeEventListener("mouseover", mouseover3, true);
				divAntwort[3].removeEventListener("mouseover", mouseover4, true);
				divAntwort[0].onmouseout = null;
				divAntwort[1].onmouseout = null;
				divAntwort[2].onmouseout = null;
				divAntwort[3].onmouseout = null;
				divAntwort[korrekteAntwort].setAttribute("id", "antwort_richtig");
				if(ausgewahlteAntwort != null){
					divAntwort[ausgewahlteAntwort].setAttribute("id", "antwort_falsch");
				}
				$("#progressbar").hide('slow');
				setTimeout('frageAnfordern()', 2000);
				break;
			}
		}
	}
}
/**
 * Funktion bekommt Fehlernachricht von Server und gibt ihn aus
 * @param nachricht
 */
function spielAbbrechen(nachricht){
	var hauptansicht = document.getElementById("hauptansicht");
	for(var n = 0; n < 4; n++){
		if(divAntwort[n] != null){
			hauptansicht.removeChild(divAntwort[n]);
		}
	}
	if(divFrage != null){
		hauptansicht.removeChild(divFrage);
	}
	$("#progressbar").hide('slow');
	var divEnde = document.createElement("div");
	divEnde.setAttribute("id", "spielende");
	var endeText = document.createTextNode(nachricht);
	divEnde.appendChild(endeText);
	hauptansicht.appendChild(divEnde);
	spielleiterZurucksetzen();
	setTimeout(reload, 30000);
}
/**
 * Funktion gibt die Nachricht, wenn das Spiel beendet wurde
 * @param rang
 */
function spielEnde(){
	var hauptansicht = document.getElementById("hauptansicht");
	
	var divwarten_ = document.createElement("div");
	divwarten_.setAttribute("id", "warten");
	var warten_text = document.createTextNode("Auf andere Spieler warten!");
	divwarten_.appendChild(warten_text);
	hauptansicht.appendChild(divwarten_);
	
	
	for(var n = 0; n < 4; n++){
		hauptansicht.removeChild(divAntwort[n]);
	}
	
	hauptansicht.removeChild(divFrage);
	$("#progressbar").hide('slow');
}
/**
 * Funktion gibt die Positionierung des Spielers und beendet das Spiel
 * @param string
 */
function rang(string){
	var hauptansicht = document.getElementById("hauptansicht");
	var divwarten = document.getElementById("warten");
	hauptansicht.removeChild(divwarten);
	var rang = new Array();
	rang[0] = string.id0;
	rang[1] = string.id1;
	rang[2] = string.id2;
	rang[3] = string.id3;
	rang[4] = string.id4;
	rang[5] = string.id5;
	var count = (Object.keys(string).length) -1;
	for(var i = 0; i < 6; i++){
		if(id == i){
			console.log("Rang" + rang[i]);
			var divRang = document.createElement("div");
			divRang.setAttribute("id", "spielende");
			if(rang[i] == 1){
				var rangText = document.createTextNode("Sie haben gewonnen!!! Ihr Punktenstand: " + punkten);
			}else{
				var rangText = document.createTextNode("Ihr Platz: " + rang[i] + "!!!    Ihr Punktenstand: " + punkten);
			}
			divRang.appendChild(rangText);
			hauptansicht.appendChild(divRang);
		}
	}
	spielleiterZurucksetzen();
	setTimeout(reload, 30000);
}

function reload(){
	window.location.reload();
}







